---
title: migrate
---

# migrate

Migrate the [Data payload](/docs/api-reference/data-model/data) to the latest shape, automatically transforming deprecated data.

```tsx copy showLineNumbers {7-10}
import { migrate } from "@measured/puck";

migrate(legacyData);
```

## Migrations

### Root data to props

Migrates any props stored on root data to the `props` object.

**Before**

```json
{
  "root": {
    "title": "Hello, world"
  }
}
```

**After**

```json
{
  "root": {
    "props": { "title": "Hello, world" }
  }
}
```

### DropZones to slots

Migrates all [DropZone](/docs/api-reference/components/drop-zone) data from [`zones`](/docs/api-reference/data-model/data#zones) to inline [slots](/docs/api-reference/fields/slot). Requires slots to be provided via the [`config`](#config) arg, where the field name for the slot matches the `zone` prop of the DropZone. See the [DropZone to slots migration guide](/docs/guides/migrations/dropzones-to-slots) for more information.

**Before**

```json showLineNumbers {10-20}
{
  "content": [
    {
      "type": "Grid",
      "props": {
        "id": "Grid-12345"
      }
    }
  ],
  "zones": {
    "Grid-12345:items": [
      {
        "type": "HeadingBlock",
        "props": {
          "id": "Heading-12345",
          "title": "Hello, world"
        }
      }
    ]
  }
}
```

**After**

```json showLineNumbers {7-15}
{
  "content": [
    {
      "type": "Grid",
      "props": {
        "id": "Grid-12345",
        "items": [
          {
            "type": "HeadingBlock",
            "props": {
              "id": "Heading-12345",
              "title": "Hello, world"
            }
          }
        ]
      }
    }
  ]
}
```

## Args

| Param                                   | Example                                       | Type                                               | Status   |
| --------------------------------------- | --------------------------------------------- | -------------------------------------------------- | -------- |
| [`data`](#data)                         | `{ content: [{type: "Heading", props: {} }]}` | [Data](/docs/api-reference/data-model/data)        | Required |
| [`config`](#config)                     | `{ components: {} }`                          | [Config](/docs/api-reference/configuration/config) | -        |
| [`migrationOptions`](#migrationoptions) | `{ migrateDynamicZonesForComponent: {} }`     | [MigrationOptions](#migrationoptions-type)         | -        |

### `data`

The legacy data you want to transform.

### `config`

A [config](/docs/api-reference/configuration/config) object. Required if migrating data with [slots](/docs/api-reference/fields/slot).

### `migrationOptions`

Options to customize how data is migrated.

#### `migrateDynamicZonesForComponent`

An object mapping component names to custom dropzone migration functions. The function will be called for any component with DropZones that don't have a slot field definition with a matching name in the config.

Each migration function receives:

- `props`: The current component props
- `zones`: A record of zone names to their content

The function should return the updated component props with the migrated zone data.

```tsx
migrate(legacyData, config, {
  migrateDynamicZonesForComponent: {
    Columns: (props, zones) => {
      return {
        ...props,
        columns: Object.values(zones).map((zone) => ({
          column: zone,
        })),
      };
    },
  },
});
```

**Before**

```json showLineNumbers {16-26}
{
  "root": {
    "props": {
      "title": "Legacy Zones Migration"
    }
  },
  "content": [
    {
      "type": "Columns",
      "props": {
        "columns": [{}],
        "id": "Columns-eb9dfe22-4408-44e6-b8e5-fbaedbbdb3be"
      }
    }
  ],
  "zones": {
    "Columns-eb9dfe22-4408-44e6-b8e5-fbaedbbdb3be:column-0": [
      {
        "type": "Text",
        "props": {
          "text": "Drop zone 1",
          "id": "Text-c2b5c0a5-d76b-4120-8bb3-99934e119967"
        }
      }
    ]
  }
}
```

**After**

```json showLineNumbers {11-23}
{
  "root": {
    "props": {
      "title": "Legacy Zones Migration"
    }
  },
  "content": [
    {
      "type": "Columns",
      "props": {
        "columns": [
          {
            "column": [
              {
                "type": "Text",
                "props": {
                  "text": "Drop zone 1",
                  "id": "Text-c2b5c0a5-d76b-4120-8bb3-99934e119967"
                }
              }
            ]
          }
        ],
        "id": "Columns-eb9dfe22-4408-44e6-b8e5-fbaedbbdb3be"
      }
    }
  ]
}
```

## Returns

The updated [Data](/docs/api-reference/data-model/data) object.
